import React from 'react';
import { Menu, Dropdown, Icon } from 'antd';

const DropMenu = ({ showTitle,placement,menuList,handleMenuClick,ID }) => {
    const onClick = ({ key }) => {
        if (ID!== undefined){
            handleMenuClick(ID,key);
        } else {
            handleMenuClick(key);
        }
    };

    const menu = (
        <Menu onClick={ onClick }>
            {
                menuList.map((e)=>{
                    return (
                        <Menu.Item key={e.key} style={{color: '#009DFF'}}>
                            <Icon type={e.IconType} style={{marginRight: 5}}/> {e.title}
                        </Menu.Item>
                    )
                })
            }
        </Menu>
    );

    return (
        <Dropdown overlay={menu} placement={ placement }>
            <div style={{color: '#009DFF',cursor: 'pointer'}}>
                {showTitle}<Icon type="down" />
            </div>
        </Dropdown>
    )
};

export default DropMenu;
